<!-- 企业变更历史 -->
<template>
  <div class="detail-index-content">
    <HeadLabel title="变更历史记录" />
    <div class="page-main-content">
      <Table :columns="columnsRecord" :data="listData">
        <template slot-scope="{ row }" slot="changeBefore">
          <ViewImg :isImg="false" @BtnClick="viewDetail(row, 0)"></ViewImg>
        </template>
        <template slot-scope="{ row }" slot="status">
          <tag type="border" color="primary">{{ row.auditStatusName }}</tag>
        </template>
        <template slot-scope="{ row }" slot="changeAfter">
          <ViewImg :isImg="false" @BtnClick="viewDetail(row, 1)"></ViewImg>
        </template>
      </Table>
    </div>
    <ChangeBeforeAfter
      v-if="isHide"
      :isHide="isHide"
      :updateIsHide.sync="isHide"
      :companyId="companyId"
      :changeTypes="changeTypes"
      :isCompanyChange="isCompanyChange"
    />
  </div>
</template>

<script type="text/javascript">
import {
  GetCompanyChangeHistory, //查询企业信息变更列表
} from "@/api/enterpriseInforManage.js";

import ChangeBeforeAfter from "./changeBeforeAfter.vue";

export default {
  name: "changeRecord",
  components: {
    ChangeBeforeAfter,
  },
  data() {
    return {
      columnsRecord: [
        {
          title: "变更时间",
          key: "createDateTime",
        },
        {
          title: "变更类型",
          key: "changeTypeName",
        },
        {
          title: "变更前",
          slot: "changeBefore",
        },
        {
          title: "审核状态",
          slot: "status",
        },
        {
          title: "变更后",
          slot: "changeAfter",
        },
        {
          title: "拒绝理由",
          key: "rejectReason",
        },
      ],
      listData: [],
      isHide: false,
      companyId: "",
      changeTypes: "",
      isCompanyChange: false,
    };
  },
  methods: {
    async getCompanyChangeHistoryData(companyId) {
      let params = {
        companyId,
        changeType: 0,
      };
      let data = await GetCompanyChangeHistory(params);
      this.listData = data;
    },
    // 查看详情
    viewDetail(row, types) {
      (this.companyId = row.id), (this.changeTypes = types);
      this.isHide = true;
    },
  },
  mounted() {
    let { query } = this.$route;
    this.isCompanyChange = query.changeType == 0 ? true : false;
    this.getCompanyChangeHistoryData(query.companyId);
  },
};
</script>

<style lang="less" scoped>
.page-main-content {
  padding: 20px;
  background: #fff;
}
</style>
